<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>刷棒棒糖</title>
<link rel="stylesheet" type="text/css" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
<style>
.container {
  margin-top: 20px;
}
.log {
  max-height: 200px;
  overflow-y: scroll;
}
</style>
</head>
<body>
  <div class="container">
    <div class="left">
      <div class="panel panel-default">
        <div class="panel-heading">用户列表
          <button class="btn btn-primary btn-xs pull-right" type="button" onclick="add()">新增</button>
          <button class="btn btn-success btn-xs" type="button" onclick="back()">返回</button>
        </div>

        <div class="panel-body">
          <table class="table table-condensed">
            <thead>
              <tr class="text-nowrap">
                <th>序号</th>
                <th>订单号</th>
                <th>用户名</th>
                <th>分享链接</th>
                <th>开始时间</th>
                <th>到期时间</th>
                <th>状态</th>
                <th>更新时间</th>
                <th>管理</th>
              </tr>
            </thead>
            <tbody id="user_list">
              <script id="user_template" type="text/x-dot-template">
                {{ for(var prop in it) { }}
                <tr>
                  <th>{{= parseInt(prop)+1}}</th>
                  <td>{{= it[prop].order_no}}</td>
                  <td>{{= it[prop].username}}</td>
                  <td>{{= it[prop].share_link}}</td>
                  <td>{{= it[prop].start_date}}</td>
                  <td>{{= it[prop].end_date}}</td>
                  <td><span class="label label-success">{{= it[prop].status}}</span></td>
                  <td>{{= it[prop].status_time}}</td>
                  <td>
                    <button class="btn btn-success btn-xs" type="button" onclick="edit('{{= it[prop].order_no}}')">修改</button>
                    <button class="btn btn-danger btn-xs" type="button" onclick="del('{{= it[prop].order_no}}')">删除</button>
                  </td>
                </tr>
                {{ } }}
              </script>
            </tbody>
          </table>
        </div>
      </div>
    </div>
  </div>
  <script>
  // 重命名 Electron 提供的 require
  window.nodeRequire = require;
  delete window.require;
  delete window.exports;
  delete window.module;
  </script>
  <script type="text/javascript" src="node_modules/jquery/jquery.min.js"></script>
  <script type="text/javascript" src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
  <script type="text/javascript" src="node_modules/lowdb/dist/lowdb.min.js"></script>
  <script type="text/javascript" src="node_modules/lodash/lodash.min.js"></script>
  <script type="text/javascript" src="node_modules/dot/doT.min.js"></script>
  <script>
  const {BrowserWindow} = nodeRequire('electron').remote;
  let globalParam = nodeRequire('electron').remote.getGlobal('sharedObject');
  var low = nodeRequire('lowdb');
  //数据列表模版
  const user_template = doT.template($("#user_template").text());
  // db.defaults({ proxy_ip: [], user_info: [] })
  //   .value()

  //初始化用户列表
  init_user_list();

  nodeRequire('electron').remote.ipcMain.on('refresh_user_list', function(event, arg) {
    console.log('刷新当前页...');
    // nodeRequire('electron').remote.getCurrentWindow().reload();
    init_user_list();
  });

  function init_user_list() {
    let user_list  = low('db.json').get('user_info').value();
    $("#user_list").html(user_template(user_list));
  }
  function add() {
    let win = new BrowserWindow({
      width: 800,
      height: 600,
      show: true });
    win.loadURL(`file://${__dirname}/user_add.html`);
  }
  function edit(order_no) {
    let win = new BrowserWindow({
      width: 800,
      height: 600,
      show: true });
    globalParam.order_no = order_no;
    win.loadURL(`file://${__dirname}/user_edit.html`);
  }

  function del(order_no) {
    let result = confirm('确认删除？');
    if(result) {
      console.log('删除');
      low('db.json').get('user_info').remove({order_no: order_no}).value();
      init_user_list();
    } else {
      console.log('取消');
    }
  }

  function back() {
    nodeRequire('electron').remote.getCurrentWindow().close();
  }
  </script>
</body>

</html>
